<template>
    <el-upload v-model:file-list="fileList" list-type="picture-card" :action="fileApi.uploadOneURL" :auto-upload="true"
        :on-success="onSuccess"
        :limit="limit"
        :on-error="onError"
        >
        <el-icon >
            <Plus />
        </el-icon>
    </el-upload>
</template>
<script setup>
// 暴露的事件
const emits = defineEmits(['onSuccess','update:fileList',])

const props = defineProps({
    limit : {
        type : Number,
        default : 1
    },
    fileList : {
        type : Object,
        default : []
    }
})

import { ref, getCurrentInstance } from 'vue'
import fileApi from '@/api/file'
import ApiCode from '@/constants/ApiCode'
import msgUtil from '@/utils/msgUtil'
const fileList = ref(props.fileList)

// const {
//   proxy: { $forceUpdate },
// } = getCurrentInstance()

function onSuccess(response, file, files) {

    if (response.code != ApiCode.OK) {
        msgUtil.warnMsg({
            title: '上传文件失败',
            message: '' + response.msg,
        })

        let list = fileList.value;
        let newList = [];
        list.forEach(item => {

            if (item.uid != file.uid) {
                newList.push(item);
            }
        })

        fileList.value = newList
        emits('update:fileList', newList)
    }else{
        emits('update:fileList', fileList.value)
        emits('onSuccess', response.data, file, files)
    }

    // $forceUpdate()
}

// function updatePreviewFileList(fileListArg){
//     fileList.value = fileListArg
//     emits('update:fileList', fileList.value)
// }

function onError(error, file, files) {
    console.log('error=====')
    console.log(error)
}

// defineExpose({
//     updatePreviewFileList
// })

</script>